<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            font-family: SimHei;
        }

        @page {
            @bottom-center {
                content: counter(page);
                font-family: SimHei;
                font-size: 16px;
                color: #FF0000;
            };
            size: A4;
        }

        th, td {
            font-size: 12px;
            height: 35px;
            text-align: left;
            padding-left: 2px;
            word-wrap: break-word;
            word-break: break-all;
        }

        .ttd {
            height: 52px;
            font-size: 12px;
        }

        .logo_box img {
            width: 100%;
            height: 100%;
        }


        .page {
            height: 100%;
            width: 100%;
        }

        /*头部共用*/
        .share {
            width: 100%;
        }

        .share img {
            width: 100px;
            height: 100%;
            vertical-align: middle;
        }

        .top2table {
            width: 100%;
            height: 30px;
            margin: 0px auto;
            font-size: 16px;
            border-collapse: collapse;
        }

        .top2table th, .top2table td {
            text-align: left;
        }
    </style>
</head>
<body style="width: 696px;">
<div class="page">
    <div class="share">
        <div style="width: 100%;margin: 0 auto 5px;align-items: center;">
            <img src="https://oies.oss-cn-shanghai.aliyuncs.com/OTO/oto_shortlogo.png" alt=""/>
        </div>
        <div style="width: 100%;margin: 0 auto 5px;align-items: center;padding-bottom: 40px">
            <span style="margin-left: 160px;font-size: 25px">${monthTime}</span>
        </div>

<!--        <table border="1" class="top2table">-->
<!--            <tr>-->
<!--                <th style="padding-left: 15px;">姓名：<span>${childName}</span></th>-->
<!--                <th style="padding-left: 15px;">生理年龄：${childAge}</th>-->
<!--            </tr>-->
<!--            <tr>-->
<!--                <th style="padding-left: 15px;">使用时间：<span>${scheduleTime}</span></th>-->
<!--                <th style="padding-left: 15px;">责任老师：<span>${teacherName}</span></th>-->
<!--            </tr>-->
<!--        </table>-->
        <div style="padding-bottom: 15px">
            姓名：<span style="font-size: 15px;padding-right: 30px">${childName}</span>
            生理年龄：<span style="font-size: 15px;padding-right: 30px">${childAge}</span>
            使用时间：<span style="font-size: 15px;padding-right: 30px">${scheduleTime}</span>
            责任老师：<span style="font-size: 15px;padding-right: 30px">${teacherName}</span>
        </div>

    </div>
    <table border="1" class="top2table">
        <thead>
        <tr style="height: 50px">
            <th style="width: 70px;text-align: center;font-size: 15px">训练目标</th>
            <th style="width: 30px;text-align: center;font-size: 15px">序号</th>
            <th style="width: 100px;text-align: center;font-size: 15px">训练项目名称</th>
            <th style="width: 250px;text-align: center;font-size: 15px">训练项目描述</th>
        </tr>
        </thead>
        <tbody>
            <tr>
                <td rowspan="${program4?size}" style="width: 70px; text-align: center">基础认知</td>
                <td class="ttd" style="width: 30px; text-align: center">1</td>
                <td class="ttd" style="width: 100px;">${program4[0].name}</td>
                <td class="ttd" style="width: 250px;">${program4[0].content}</td>
            </tr>
            <#list program4 as str>
                <#if str_index != 0>
                    <tr>
                        <td class="ttd" style="width: 30px; text-align: center">${str_index+1}</td>
                        <td class="ttd" style="width: 200px;">${str.name}</td>
                        <td class="ttd" style="width: 250px;">${str.content}</td>
                    </tr>
                </#if>
            </#list>
            <tr>
                <td rowspan="${program5?size}" style="width: 70px; text-align: center">认知能力</td>
                <td class="ttd" style="width: 30px; text-align: center">${program4?size+1}</td>
                <td class="ttd" style="width: 100px;">${program5[0].name}</td>
                <td class="ttd" style="width: 250px;">${program5[0].content}</td>
            </tr>
            <#list program5 as str>
                <#if str_index != 0>
                    <tr>
                        <td class="ttd" style="width: 30px; text-align: center">${program4?size+str_index+1}</td>
                        <td class="ttd" style="width: 100px;">${str.name}</td>
                        <td class="ttd" style="width: 250px;">${str.content}</td>
                    </tr>
                </#if>
            </#list>
        </tbody>
    </table>
    </div>
</body>
</html>